<div id="fb-root"></div>
<script>
	function gotoTab(tabId, that) {
		$(".tabPanel").css("display", "none");
		$("#" + tabId).css("display", "block");
		$(".subNavItem").removeClass("subNavItemActive");
		$(that).addClass("subNavItemActive");
	}
</script>

<div id="centerWrapper" style="display: block;margin-top: -80px;">
		<div id="wrapper" style="padding-top: 81px;">
			<div id="subNavWrapperTab" style="display: block;">
			<div id="subNav1" style="height:30px;">
				<a style="background-color:  rgb(85, 160, 2);" href="#" class="subNavItem subNavItemActive" onclick="gotoTab('tab1',this);">Hướng dẫn</a>
				<a style="background-color:  rgb(85, 160, 2);" href="#" class="subNavItem" onclick="gotoTab('tab2',this);">Thảo luận</a>
				<a style="background-color:  rgb(85,160,2);" href="#" class="subNavItem" onclick="gotoTab('tab3',this);">Demos</a>
			</div>
			</div>
			<div id="contentWrapperTab" style="min-height: 20px; display: block;">   		    
   		            <div id="content" style="margin-left: 0px; display: block;">
						<div class="tabPanel" id="tab1">
							<h1 class="margin-t-0">Hướng dẫn</h1>
							<hr>
							<?php echo $data["Product"]["details"];?>
						</div>
						<div class="tabPanel" id="tab2" style="display: none;">
							<h1 class="margin-t-1">Thảo luận</h1>
							<hr>
							<div style="background-color: white;" data-width="820" class="fb-comments" data-href="<?php echo HOST_NAME."/detail/".$data['Product']['shortLink'] ?>" data-numposts="5" data-colorscheme="light" data-order-by="reverse_time" ></div>
						</div>
						<div class="tabPanel" id="tab3" style="display: none;">
							<h1 class="margin-t-1">Info</h1>
							<hr>
							Tính năng đang phát triển
						</div>
					</div>
	    		</div>
            </div>
            </div>
     